<template>
    <div>
      <el-drawer
        v-model="drawer"
        :title="title"
        :size="size"
        :close-on-click-modal="false"
      >
        <div class="body">
          <div class="content">
            <UploadFile></UploadFile>
          </div>
          <div v-show="showBtn">
            <el-button type="primary" @click="fn2">{{ commitText }}</el-button>
  
            <el-button type="primary" @click="close">取消</el-button>
          </div>
        </div>
      </el-drawer>
    </div>
  </template>
  
  <script setup>
  import UploadFile from "@/views/imageList/UploadFile.vue";
  import { ref } from "vue";
  const emits = defineEmits(["submit"]);
  
  const fn2 = () => {
    emits("submit");
  };
  
  defineProps({
    title: {
      type: String,
      default: "",
    },
    size: {
      default: "45%",
    },
    commitText: {
      type: String,
      default: "提交",
    },
    showBtn: {
      type: Boolean,
      default: true,
    },
  });
  
  const drawer = ref(false);
  
  const open = () => {
    drawer.value = true;
  };
  const close = () => {
    drawer.value = false;
  };
  
  defineExpose({
    open,
    close,
  });
  </script>
  
  <style lang="less" scoped>
  .body {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    .content {
      height: 85%;
      overflow-y: scroll;
    }
  }
  </style>
  